<template>
  <workflow-pro title="hello" content="content"></workflow-pro>

  <!-- <task-detail
    ref="taskDetailRef"
    :id="nowTaskId"
    :is-template="path.indexOf('template') > -1"
    @on-close="refreshTaskList"
  ></task-detail> -->

  <!-- <update-task-float
    :task-detail="nowTask"
    ref="updateTaskFloatRef"
    :is-template="path.indexOf('template') > -1"
    @on-update="refreshTaskList"
  ></update-task-float> -->
  <xr-dialog
    ref="editStageRef"
    v-bind="editStageDialog"
    v-model="editStageDialogVisible"
    @confirm-click="confirmEditStage"
  >
    <template #body>
      <div style="color: #999; margin-bottom: 10px">
        请选择阶段，如果没有则输入阶段名称后，点击自动创建
      </div>
      <div class="flex w-100">
        <xr-select
          :select-props="{ allowCreate: true, filterable: true }"
          class="w-100"
          ref="stageListRef"
          :requestFun="stageList"
          placeholder="请选择阶段"
          select-label="stageName"
          select-value="stageName"
          v-model="stageName"
        ></xr-select>
      </div>
    </template>
  </xr-dialog>
</template>

<script setup lang="ts">
import { useRouter } from "vue-router";
import xrSelect from "./components/select.vue";
import xrDialog from "./components/dialog.vue";

import { ref, reactive } from "vue";
const nowTaskId = ref("");
const updateTaskFloatRef = ref();
const editStageRef = ref();
const router: any = useRouter();

import workflowPro from "./components/workflow-pro.vue";
const { path, params } = useRouter().currentRoute.value.query || "";

// 编辑阶段
const editStageDialog = reactive({
  title: "编辑阶段",
  unScroll: false,
  checkCancel: true,
  showFooter: true,
  centerStyle: "padding:20px 20px;",
  contentStyle: "height:200px;width:500px;",
});

const editStageDialogVisible = ref(false);

const stageList = ref([]);
const data = [
  {
    title: "北京翊博生物集团有限公司Level01",
    des: "发起人",
    isRoot: true,
    children: [
      {
        title: "北京翊博生物集团有限公司Level02",
        des: "审批人",
        children: [
          {
            title: "北京翊博生物集团有限公司Level03",
            des: "抄送人",
          },
        ],
      },
    ],
  },
];

const confirmEditStage = () => {
  const editParams: any = {
    taskId: editTaskDetail.value.id,
    moduleId: _processG6.isTemplate
      ? editTaskDetail.value.templateId
      : editTaskDetail.value.prepareStoreId,
    taskSource: taskSource.value,
  };
  const selectStage = stageList.value.find(
    (item) => item.stageName == stageName.value
  );
  if (selectStage) {
    editParams.stageId = selectStage.id;
  }
  apiCreateTaskStage(editParams).then(() => {
    editStageDialogVisible.value = false;
    refreshTaskList();
  });
};

const renderSubMenu = () => {
  function travel(_route, nodes = []) {
    if (_route) {
      _route.forEach((element) => {
        const node =
          element?.children && element?.children.length !== 0
            ? travel(element?.children)
            : 2;
        nodes.push(node as never);
      });
    }
    return nodes;
  }

  return travel(data);
};

const result = renderSubMenu();

console.log("result", result);

const refreshTaskList = () => {
  buildTaskViewer().then(() => {
    console.log(viewerData.value, "viewerData refreshTaskList");
    viewer.value.data(viewerData.value);
    viewer.value.render();
  });
};
</script>
